<template>
  <div>
    <div class="title">通用桌面平台</div>
    <div class="logo">
      <img src="~src/assets/logo.png" alt="" />
    </div>
    <div style="padding: 20px 0px">用户名是： {{ profileStore.userName }}</div>
    <div>设备ID：{{ machineId }}</div>
    <div>
      <a-button @click="linkTo('/about')">about link</a-button>
      <a-button @click="linkTo('/test')">test link</a-button>
    </div>
  </div>
</template>

<script setup>
import { useRouter } from "vue-router";
import { useProfileStore } from "src/store/profileStore";
import { machineIdSync } from "node-machine-id";
import { onMounted, ref } from "vue";
import db from "src/datastore/nedb";

const machineId = ref("");
const profileStore = useProfileStore(); // 获取到store的实例
const appRouter = useRouter();
const linkTo = (url) => {
  appRouter.push(url);
};

onMounted(async () => {
  machineId.value = machineIdSync();
  db.find({}, function (err, ret) {
    if (err) {
      console.log("err", err);
    }
    console.log("ret", ret);
  });
});
</script>

<style scoped>
.title {
  font-size: 28px;
  font-weight: 600;
}
.logo {
  padding: 40px 0px;
}
</style>